<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta
            name="viewport"
            content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
        />
        <meta
            name="format-detection"
            content="telephone=no,email=no,date=no,address=no"
        />
        <title></title>
        <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
        <style>
            body {
                background-color: #03a9f4;
            }

            #frm-container {
                margin: 0 auto;
                width: 83%;
                height: 100%;
                border-radius: 20px;
                border: 2px solid white;
                padding: 5px 10px;
                background: white;
            }

            #footer {
                background: none;
                position: absolute;
                bottom: 0;
            }
        </style>
    </head>

    <body>
        <header class="aui-bar aui-bar-nav" id="aui-header">
            <div class="aui-pull-left aui-btn" onclick="close_win();">
                <span class="aui-iconfont aui-icon-left"></span>返回
            </div>
            <div class="aui-title" style="left: 2rem; right: 2rem"></div>
        </header>
        <div id="frm-container" class="aui-content-padded">
            <div
                class="aui-tab aui-margin-t-10 aui-margin-b-5 aui-font-size-18"
            >
                <div style="color: #03a9f4; margin: 0 auto">更换手机号</div>
            </div>
            <div
                class="aui-hr"
                style="
                    width: 90%;
                    margin: 0 auto;
                    border-top: 0.05rem solid #03a9f4;
                "
            ></div>
            <section class="aui-content-padded"></section>
            <section class="aui-content-padded">
                <div
                    class="aui-searchbar"
                    id="search"
                    style="
                        margin-bottom: 1rem;
                        background-color: #ffffff;
                        width: 100%;
                    "
                >
                    <div
                        class="aui-searchbar-input aui-border-radius"
                        style="
                            margin: 0rem;
                            height: 1.8rem;
                            border: 1px solid #459bde;
                            background-color: transparent;
                        "
                    >
                        <div
                            class="aui-iconfont aui-icon-mobile"
                            style="
                                width: 16px;
                                font-size: 12px;
                                margin-top: 3px;
                            "
                        ></div>
                        <div
                            style="
                                margin-top: 7px;
                                margin-right: 8px;
                                height: 21px;
                                width: 1px;
                                border-left: 1px #459bde solid;
                            "
                        ></div>
                        <input
                            style="margin-top: 3px; font-size: 0.8rem"
                            type="search"
                            placeholder="请输入旧手机号"
                            id="login_username"
                        />
                        <div class="aui-searchbar-clear-btn">
                            <i class="aui-iconfont aui-icon-close"></i>
                        </div>
                    </div>
                    <div class="aui-searchbar-btn" tapmode>取消</div>
                </div>

                <div
                    class="aui-searchbar"
                    id="search"
                    style="
                        margin-bottom: 1rem;
                        background-color: #ffffff;
                        width: 100%;
                    "
                >
                    <div
                        class="aui-searchbar-input aui-border-radius"
                        style="
                            width: 60%;
                            margin: 0rem;
                            height: 1.8rem;
                            border: 1px solid #459bde;
                            background-color: transparent;
                        "
                    >
                        <div
                            class="aui-iconfont aui-icon-mail"
                            style="
                                width: 16px;
                                font-size: 12px;
                                margin-top: 3px;
                            "
                        ></div>
                        <div
                            style="
                                margin-top: 7px;
                                margin-right: 8px;
                                height: 21px;
                                width: 1px;
                                border-left: 1px #459bde solid;
                            "
                        ></div>
                        <input
                            style="margin-top: 3px; font-size: 0.8rem"
                            type="search"
                            placeholder="短信验证码"
                            id="msgcode"
                        />
                        <div class="aui-searchbar-clear-btn">
                            <i class="aui-iconfont aui-icon-close"></i>
                        </div>
                    </div>
                    <div
                        class="aui-btn aui-btn-block aui-btn-sm aui-font-size-12"
                        style="text-align: center; width: 35%; margin-left: 5%"
                        tapmode
                        onclick="sms();"
                    >
                        获取验证码
                    </div>
                    <div class="aui-searchbar-btn" tapmode>取消</div>
                </div>

                <div
                    class="aui-searchbar"
                    id="search"
                    style="
                        margin-bottom: 1rem;
                        background-color: #ffffff;
                        width: 100%;
                    "
                >
                    <div
                        class="aui-searchbar-input aui-border-radius"
                        style="
                            margin: 0rem;
                            height: 1.8rem;
                            border: 1px solid #459bde;
                            background-color: transparent;
                        "
                    >
                        <div
                            class="aui-iconfont aui-icon-mobile"
                            style="
                                width: 16px;
                                font-size: 12px;
                                margin-top: 3px;
                            "
                        ></div>
                        <div
                            style="
                                margin-top: 7px;
                                margin-right: 8px;
                                height: 21px;
                                width: 1px;
                                border-left: 1px #459bde solid;
                            "
                        ></div>
                        <input
                            style="margin-top: 3px; font-size: 0.8rem"
                            type="search"
                            placeholder="请输入新手机号"
                            id="login_username_new"
                        />
                        <div class="aui-searchbar-clear-btn">
                            <i class="aui-iconfont aui-icon-close"></i>
                        </div>
                    </div>
                    <div class="aui-searchbar-btn" tapmode>取消</div>
                </div>

                <div
                    class="aui-btn aui-btn-block aui-btn-info aui-btn-sm aui-font-size-18"
                    style="margin-top: 1rem; margin-bottom: 0.5rem"
                    onclick="finish();"
                >
                    完成
                </div>
                <div
                    class="aui-font-size-30"
                    style="text-align: center; color: #459bde"
                    onclick="close_win();"
                >
                    取消
                </div>
            </section>
        </div>
    </body>
    <script type="text/javascript" src="../../../script/api.js"></script>
    <script>
        function close_win() {
            api.openWin({
                name: "MainMenu",
                url: "./../MainMenu.html",
                reload: true,
            });
        }
    </script>
    <!-- <script type="text/javascript">
    var login_user_info;
       var smsVerify = null;
       var n = 0;
       var intervalID;
    apiready = function() {
      smsVerify = api.require('smsVerify');
        register();
        login_user_info = api.pageParam.login_user_info;
        api.parseTapmode();
        $api.fixStatusBar($api.byId('aui-header'));
        $api.css($api.byId('frm-container'), 'height:' + (api.frameHeight - 48 - $api.offset($api.byId('aui-header')).h) * 0.9 + 'px;');

        $api.val($api.byId('login_username'), login_user_info.phoneNum);
    }
    function register() {
        smsVerify.register(function(ret, err) {
            if (ret.status) {
                //api.alert({msg: '注册成功'});
                console.log('注册成功');
            } else {
                // api.alert({
                //     msg: err.code + ' 注册失败'
                // });
            }
        });
    }
    function setEnable() {
        n++;
        if (n > 0 && n <= 60) {
                document.getElementById("sendValidcode").innerText = "重新发送(" + (60 - n) + "s)";
              //  document.getElementById("sendValidcode").removeEventListener("click", sms, false);
                document.getElementById("sendValidcode").disabled = true;
                document.getElementById("sendValidcode").style.backgroundColor = '#B8B8B8';
                document.getElementById("sendValidcode").style.color = '#000000';

        } else {
                document.getElementById("sendValidcode").innerText = "获取验证码";
                //document.getElementById("sendValidcode").addEventListener("click", sms, false);
                document.getElementById("sendValidcode").disabled = false;
                document.getElementById("sendValidcode").style.backgroundColor = '#03a9f4';
                document.getElementById("sendValidcode").style.color = '#ffffff';
                window.clearInterval(intervalID);
                n=0;
        }
    }
    // 短信验证码
    function sms() {
      if ($api.val($api.byId('login_username')).trim() == "") {
          api.toast({
              msg: "手机号不能为空",
              duration: 2000,
              location: 'bottom'
          });
          return ;
      }
      if ($api.val($api.byId('login_username')).length != 11) {
          api.toast({
              msg: "手机号格式错误",
              duration: 2000,
              location: 'bottom'
          });
          return ;
      }
        var phone = document.getElementById("mobile").value;
        intervalID = window.setInterval("setEnable()", 1000);
        smsVerify.sms({
            phone: phone,
        }, function(ret, err) {
            if (ret.status) {
                // 新增的安卓智能验证功能
                if (ret.smart == true) { // 安卓版特有功能 智能验证成功
                    api.alert({
                        msg: '智能验证成功，开发者可以为用户直接跳转到手机号验证成功之后的操作'
                    });
                } else {
                    api.alert({
                       msg: '短信发送成功'
                    });
                }
            } else {
                api.alert({
                    msg: ' 短信发送失败'
                });
            }
        });
    }
    function finish() {
        if (!form_check()) return;
        var phone = document.getElementById("login_username").value;
        var code = document.getElementById("msgcode").value;
        smsVerify.verify({
            phone: phone,
            code: code,
        }, function(ret, err) {
            if (ret.status) {
                console.log('注册验证码验证成功');
                api.ajax({
                    url: $api.getStorage("api_url") + '/lansys/user/saveUserInfo',
                    method: 'post',
                    timeout: 5,
                    data: {
                        values: {
                            userID: login_user_info.userID,
                            key: "phoneNum",
                            value: $api.val($api.byId('login_username_new'))
                        }
                    }
                }, function(ret, err) {
                    if (ret) {
                        var response = JSON.stringify(ret);
                        console.log(response);
                        if (ret.result == "success") {
                            api.alert({
                                title: '修改结果',
                                msg: "修改手机号成功, 请重新登录",
                            }, function(ret, err) {
                                api.closeToWin({
                                    name: 'login'
                                });
                            });
                        } else {
                            api.toast({
                                msg: decodeURI(ret.msg),
                                duration: 2000,
                                location: 'bottom'
                            });
                        }
                    } else {
                        api.toast({
                            msg: err,
                            duration: 2000,
                            location: 'bottom'
                        });
                    }
                });
            } else {
                api.alert({
                    msg: ' 短信验证码验证失败'
                });
            }
        });
    }

    function close_win() {
        api.closeWin({});
    }
</script> -->
</html>
